//立即执行函数  (function () { 代码块 })()
//点击不同的模块，页面可以自动跳转不同的位置
;(function () {
  const elevator = document.querySelector('.xtx-elevator')
  const backTop = document.querySelector('#backTop')
  window.addEventListener('scroll', function () {
    elevator.style.opacity = document.documentElement.scrollTop >= 300 ? 1 : 0
  })
  backTop.addEventListener('click', function () {
    // document.documentElement.scrollTop = 0
    //点击返回按钮，页面会返回顶部
    window.scrollTo(0, 0)
  })
})()

//点击不同的模块，页面可以自动跳转不同的位置
;(function () {
  const elevator = document.querySelector('.xtx-elevator-list')
  const newgoods = document.querySelector('.xtx_goods_newgoods')
  const popular = document.querySelector('.xtx_goods_popular')
  const brand = document.querySelector('.xtx_goods_brand')
  const topic = document.querySelector('.xtx_goods_topic')

  //点击事件
  elevator.addEventListener('click', function (e) {
    /* if (e.target.tagName === 'A') {
      switch (e.target.dataset.name) {
        case 'newgoods':
          document.documentElement.scrollTop = newgoods.offsetTop
          break
        case 'popular':
          document.documentElement.scrollTop = popular.offsetTop
          break
        case 'brand':
          document.documentElement.scrollTop = brand.offsetTop
          break
        case 'topic':
          document.documentElement.scrollTop = topic.offsetTop
          break
        default:
      }
    } */
    if (e.target.tagName === 'A' && e.target.dataset.name) {
      const top = document.querySelector(
        `.xtx_goods_${e.target.dataset.name}`
      ).offsetTop
      window.scrollTo(0, top)
    }
  })

  //滚动事件 页面滚动到对应位置，电梯导航对应模块文字变成绿色
  window.addEventListener('scroll', function () {
    let n = document.documentElement.scrollTop
    elevator.querySelector('a.active') &&
      elevator.querySelector('a.active').classList.remove('active')
    
    if (n >= newgoods.offsetTop && n < popular.offsetTop) {
      elevator.querySelector('a[data-name="newgoods"]').classList.add('active')
    } else if (n >= popular.offsetTop && n < brand.offsetTop) {
      elevator.querySelector('a[data-name="popular"]').classList.add('active')
    } else if (n >= brand.offsetTop && n < topic.offsetTop) {
      elevator.querySelector('a[data-name="brand"]').classList.add('active')
    } else if (n >= topic.offsetTop) {
      elevator.querySelector('a[data-name="topic"]').classList.add('active')
    }
  })
})()
